<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
	String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'MyJsp.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
<!-- 项目前置 -->
<link rel="shortcut icon" href="favicon.ico">
<link rel="stylesheet" href="css/iconfont.css">
<link rel="stylesheet" href="css/global.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/bootstrap-theme.min.css">
<link rel="stylesheet" href="css/swiper.min.css">
<link rel="stylesheet" href="css/styles.css">
<script src="js/jquery.1.12.4.min.js" charset="UTF-8"></script>
<script src="js/bootstrap.min.js" charset="UTF-8"></script>
<script src="js/swiper.min.js" charset="UTF-8"></script>
<script src="js/global.js" charset="UTF-8"></script>
<script src="js/jquery.DJMask.2.1.1.js" charset="UTF-8"></script>
<!-- 本页前置 -->
<link rel="stylesheet" href="css/login.css">
<script src="js/jquery.form.js" charset="UTF-8"></script>
<script src="js/login.js" charset="UTF-8"></script>
<!-- 本页前置 -->
<!-- 项目前置 -->

<script type="text/javascript">
	function yanzhengma(flag) {
		var appid = '79874947';
		var appsecret = 'wJpD7wKY';
		var arr = [ "0", "1", "2", "3", "4", "5", "6", "7", "8", "9" ];
		var code0 = Math.floor(Math.random() * arr.length);
		var code1 = Math.floor(Math.random() * arr.length);
		var code2 = Math.floor(Math.random() * arr.length);
		var code3 = Math.floor(Math.random() * arr.length);
		var code = arr[code0] + arr[code1] + arr[code2] + arr[code3];

		if (flag == "resetpwd") {
			var mobile = $('#mobile2').val();
		} else {
			var mobile = $('#mobile').val();
		}

		$.ajax({
			url : "YanZhengMaServlet",
			type : "post",
			data : {
				appid : appid,
				appsecret : appsecret,
				code : code,
				mobile : mobile
			},
			dataType : "json",
			success : function(data) {
				alert(data);
			},
			error : function(d1, d2) {

				alert(d1.status + "--" + d2);
			}
		});
	}

	function checkPhone(valphone, errorid) {//验证手机号
		var phone = valphone;
		var errorid = errorid;

		var num = null;
		// 验证手机号参考这个		
		if (phone.length == 0) {
			num = 1;
		} else if (phone.length != 11) {
			num = 2;
		} else {
			var reg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/;
			if (!reg.test(phone)) {
				num = 3;
			} else {
				num = 0;
			}
		}
		switch (num) {
		case 1:
			document.getElementById(errorid).innerHTML = (msgtemp(
					'<strong>手机号码为空</strong> 请输入手机号码', 'alert-warning'));
			break;
		case 2:
			document.getElementById(errorid).innerHTML = (msgtemp(
					'<strong>手机号码错误</strong> 请输入11位数的号码', 'alert-warning'));
			break;
		case 3:
			document.getElementById(errorid).innerHTML = (msgtemp(
					'<strong>手机号码错误</strong> 请输入正确的号码', 'alert-warning'));
			break;
		case 0:
			document.getElementById(errorid).innerHTML = "";
			break;
		}
		if(num==0){
			document.getElementById("phonego").value="0";
		}else{
			document.getElementById("phonego").value="";
		}
	}//
	
	function checkPwd(valpwd, errorid) {//验证密码
		var pwd = valpwd;
		var errorid = errorid;

		var pwdnum = null;

		if (pwd.length == 0) {

			pwdnum = 1;
		} else if (pwd.length < 6) {

			pwdnum = 2
		} else {
			var reg = /^(?![a-zA-z]+$)(?!\d+$)(?![!@#$%^&*]+$)[a-zA-Z\d!@#$%^&*]+$/;
			if (!reg.test(pwd)) {

				pwdnum = 3;
			} else {
				pwdnum = 0;
			}
		}

		switch (pwdnum) {
		case 1:
			document.getElementById(errorid).innerHTML = (msgtemp(
					'<strong>密码不能为空</strong> 请输入密码', 'alert-warning'));
			break;
		case 2:
			document.getElementById(errorid).innerHTML = (msgtemp(
					'<strong>密码过短</strong> 请输入6位以上的密码', 'alert-warning'));
			break;
		case 3:
			document.getElementById(errorid).innerHTML = (msgtemp(
					'<strong>密码过于简单</strong><br>密码需为字母、数字或特殊字符组合',
					'alert-warning'));
			break;
		case 0:
			document.getElementById(errorid).innerHTML = "";
			break;
		}
		if(pwdnum==0){
			document.getElementById("pwdgo").value="0";
		}else{
			document.getElementById("pwdgo").value="";
		}
	
	}//
function login() {
	var vphone=$('#phonego').val();
	var vpwd=$('#pwdgo').val();
	
	if(vphone=='0'&&vpwd=='0'){
		var flag="login";
		var uphone=$('#login_phone').val();
		var upwd=$('#login_pwd').val();
		
		if(($("#login_checkbox").prop("checked"))==false){
			 var isSave="0";
		}else{
			 var isSave="1";
		}
		location="UserServlet?flag="+flag+"&uphone="+uphone+"&upwd="+upwd+"&isSave="+isSave;
	}
	
}
	function register() {
		var vphone=$('#phonego').val();
		var vpwd=$('#pwdgo').val();
	
		if(vphone=='0'&&vpwd=='0'){
			var uname=$('#uname').val();
			var uphone=$('#mobile').val();
			var upwd=$('#upwd').val();
			var usms=$('#usms').val();
			var flag='register';	
			location="UserServlet?flag="+flag+"&uphone="+uphone+"&upwd="+upwd+"&uname="+uname+"&usms="+usms;
		}
	}
	function resetpwd() {
		var vphone=$('#phonego').val();
		var vpwd=$('#pwdgo').val();
		
		if(vphone=='0'&&vpwd=='0'){
			var uphone=$('#mobile2').val();
			alert(uphone);
			var resetupwd=$('#resetupwd').val();
			var resetusms=$('#resetusms').val();
			var flag='resetpwd';	
			location="UserServlet?flag="+flag+"&uphone="+uphone+"&resetupwd="+resetupwd+"&resetusms="+resetusms;

		}
	}
	
</script>
</head>

<body>
	<%@include file="top.jsp"%>
	<div
		style="background: url(images/login_bg.jpg) no-repeat center center;">
		<div class="login-layout container">
			<div class="form-box login">
				<div class="tabs-nav">
					<h2>欢迎登录XXX平台</h2>
				</div>
				<div class="tabs_container">
					<form class="tabs_form" action="UserServlet?flag=login"
						method="post" id="login_form">
						<div class="form-group">
							<div class="input-group">
								<div class="input-group-addon">
									<span class="glyphicon glyphicon-phone" aria-hidden="true"></span>
								</div>
								<input class="form-control phone" name="uphone" id="login_phone"
									required placeholder="手机号" maxlength="11" autocomplete="off"
									type="text" onblur="checkPhone(this.value,'login_error')" />
							</div>
						</div>
						<div class="form-group">
							<div class="input-group">
								<div class="input-group-addon">
									<span class="glyphicon glyphicon-lock" aria-hidden="true"></span>
								</div>
								<input class="form-control password\" name="upwd"
									id="login_pwd" placeholder="请输入密码" autocomplete="off"
									type="password" onblur="checkPwd(this.value,'login_error')">
								<div class="input-group-addon pwd-toggle" title="显示密码">
									<span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span>
								</div>
							</div>
						</div>
						<div class="checkbox">
							<label> <input id="login_checkbox" name="isSave"
								type="checkbox" ><i></i> 请记住我
							</label> <a href="javascript:void(0);" class="pull-right" id="resetpwd">忘记密码？</a>
						</div>
						<!-- 错误信息 -->
						<div class="form-group">
							<div class="error_msg" id="login_error"></div>
						</div>
						<button class="btn btn-large btn-primary btn-lg btn-block submit"
							id="login_submit" type="button" onclick="login()" >登录</button>
						<br>
						<p class="text-center">
							没有账号？<a href="javascript:;" id="register">免费注册</a>
						</p>
					</form>
				</div>
			</div>
			<!-- 登录 -->
			<div class="form-box register">
				<div class="tabs-nav">
					<h2>
						欢迎注册<a href="javascript:;" class="pull-right fz16" id="reglogin">返回登录</a>
					</h2>
				</div>
				<div class="tabs_container">
					<form class="tabs_form" action="UserServlet?flag=register"
						method="post" id="register_form">
						<div class="form-group">
							<div class="input-group">
								<div class="input-group-addon">
									<span class="glyphicon glyphicon-phone" aria-hidden="true"></span>
								</div>

								<input class="form-control username" name="uname" id="uname"
									required placeholder="用户名" maxlength="10" autocomplete="off"
									type="text">
							</div>
						</div>
						<!-- 用户名 -->
						<div class="form-group">
							<div class="input-group">
								<div class="input-group-addon">
									<span class="glyphicon glyphicon-phone" aria-hidden="true"></span>
								</div>
								<input class="form-control phone" name="uphone" id="mobile"
									required placeholder="手机号" maxlength="11" autocomplete="off"
									type="text" onblur="checkPhone(this.value,'register_error')">

							</div>
						</div>
						<!-- 手机号 -->
						<div class="form-group">
							<div class="input-group">
								<input type="hidden" id="code" /> <input class="form-control"
									name="usms" id="usms" placeholder="输入验证码" type="text">
								<span class="input-group-btn">
									<button class="btn btn-primary getsms" type="button"
										onclick="yanzhengma('register')">发送短信验证码</button>
								</span>
							</div>
						</div>
						<!-- 验证码 -->
						<div class="form-group">
							<div class="input-group">
								<div class="input-group-addon">
									<span class="glyphicon glyphicon-lock" aria-hidden="true"></span>
								</div>
								<input class="form-control password" name="upwd" id="upwd"
									placeholder="请输入密码" autocomplete="off" type="password"
									onblur="checkPwd(this.value,'register_error')">
								<div class="input-group-addon pwd-toggle" title="显示密码">
									<span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span>
								</div>
							</div>
						</div>
						<!-- 密码 -->
						<!--  
						<div class="checkbox">
	                        <label>
	                        	<input checked="" id="register_checkbox" type="checkbox"><i></i> 同意<a href="temp_article/udai_article3.html">XXX用户协议</a>
	                        </label>
	                    </div>
	                    -->
						<!-- 错误信息 -->
						<div class="form-group">
							<div class="error_msg" id="register_error"></div>
						</div>
						<button class="btn btn-large btn-primary btn-lg btn-block submit"
							id="register_submit" type="button" onclick="register()" >注册</button>
					</form>
					<div class="tabs_div">
						<div class="success-box">
							<div class="success-msg">
								<i class="success-icon"></i>
								<p class="success-text">注册成功</p>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!-- 注册 -->
			<div class="form-box resetpwd">
				<div class="tabs-nav clearfix">
					<h2>
						找回密码<a href="javascript:;" class="pull-right fz16" id="pwdlogin">返回登录</a>
					</h2>
				</div>
				<div class="tabs_container">
					<form class="tabs_form" action="UserServlet?flag=resetpwd"
						method="post" id="resetpwd_form">
						<div class="form-group">
							<div class="input-group">
								<div class="input-group-addon">

									<span class="glyphicon glyphicon-phone" aria-hidden="true"></span>
								</div>
								<input class="form-control phone" name="uphone" id="mobile2"
									required placeholder="手机号" maxlength="11" autocomplete="off"
									type="text" onblur="checkPhone(this.value,'resetpwd_error')">
							</div>
						</div>
						<div class="form-group">
							<div class="input-group">
								<input type="hidden" id="code2" /> <input class="form-control"
									name="resetusms" id="resetusms" placeholder="输入验证码" type="text">
								<span class="input-group-btn">
									<button class="btn btn-primary getsms" type="button"
										onclick="yanzhengma('resetpwd')">发送短信验证码</button>
								</span>
							</div>
						</div>
						<div class="form-group">
							<div class="input-group">
								<div class="input-group-addon">
									<span class="glyphicon glyphicon-lock" aria-hidden="true"></span>
								</div>
								<input class="form-control password" name="resetupwd"
									id="resetupwd" placeholder="新的密码" autocomplete="off"
									type="password" onblur="checkPwd(this.value,'resetpwd_error')">
								<div class="input-group-addon pwd-toggle" title="显示密码">
									<span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span>
								</div>
							</div>
						</div>
						<!-- 错误信息 -->
						<div class="form-group">
							<div class="error_msg" id="resetpwd_error"></div>
						</div>
						<button class="btn btn-large btn-primary btn-lg btn-block submit"
							id="resetpwd_submit" type="button" onclick="resetpwd()">重置密码</button>
					</form>

				</div>
			</div>
			<input type="hidden" id="phonego" /> <input type="hidden" id="pwdgo" />
		</div>
	</div>
	<script>
		$(document).ready(function() {
			// 判断直接进入哪个页面 例如 login.php?p=register
			switch ($.getUrlParam('p')) {
			case 'register':
				$('.register').show();
				break;
			case 'resetpwd':
				$('.resetpwd').show();
				break;
			default:
				$('.login').show();
			}
			;

		});
	</script>
	<%@include file="bottom.jsp"%>
</body>
</html>
